import React, {
  useState,
  useEffect
} from 'react';
import axios from 'axios'
/**
 * @fn react hooks 自定义hooks
 * 
 * 1. 定义一个use开头的函数
 * 2. 复用一段逻辑  （高阶组件）
 *
 */

const useLoading = () => {
  let [data, setData] = useState(null)
  let [loading, setLoading] = useState(false)
  useEffect(() => {
    // dom监听 ajax数据请求 定时器
    // 数据请求前
    setLoading(true)
    axios.get('/data.json')
      .then(res => {
        // 数据过来后
        setTimeout(() => {
          setLoading(false)
          setData(res.data)
        }, 3000)
      })
    return () => { }
  }, [])
  return [loading, data]
}

export default useLoading;